<template>
	<view>
		<u-toast ref="uToast" />
		<view v-if="show" class="loading_view">
		  <u-loading mode="circle" size="50"></u-loading>
		  <view class="messgae">
			加载中...
		  </view>
		 </view>
		 <view v-else>
		<view v-if="list.length>0">
			<view class="box_list border" v-for="(v,k) in list" @click="onNav" :data-id="v.d_id">
				
				<view class="l_head">
					<view class="img"><image :src="v.d_userIcon"></image></view>
					<view class="cont">
						<view class="c_head">
							<view class='name'>{{v.d_userNickname}}</view>
							<view class='time'>{{v.d_createTime}}</view>
						</view>
						<view class="c_bot">
							<text class='age'>{{v.d_age}}岁</text>
							<text class='address'>{{v.d_addres}}</text>
						</view>
					</view>
				</view>
				<view class="l_cont">
					<view class="l_text">{{v.d_content}}</view>
					<view class="l_images" v-if="v.d_images">
						<image v-for="(n,m) in v.d_images" :src="n"></image>
					</view>
					<view class="l_tags">
						<view class="tag" v-if="v.d_topic">
							<u-tag v-for="(n,m) in v.d_topic" :key="m" :text="'#'+n+'#'" type='info' shape='circle'/>
						</view>
					</view>
				</view>
				<view class="l_num">
					<view>
						<image src="../../static/dynamic_icon/zan.png"></image>
						<text>{{v.d_goodNum}}</text>
					</view>
					<view>
						<image src="../../static/dynamic_icon/comment.png"></image>
						<text>{{v.d_commentNum}}</text>
					</view>
				</view>
				<view class='l_comment' v-if="v.comment.length>0">
					<view v-for="(n,m) in v.comment" :key="m">{{n.c_userNickname}}: {{n.c_content}}</view>
					<view class='img'><image src="../../static/dynamic_icon/more.png"></image></view>
				</view>
			
			</view>
			
			<view class="empty" v-if="showError!=''" style="padding:20rpx 0;">
				{{showError}}
			</view>
		</view>
		<view class='empty' v-else>
			<view class='error'>您还未发布动态</view>
			<view class='btn' @click='onRelease'>我要发布</view>
		</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				list:[],
				page:1,
				allpage:1,
				show:true,
				showError:''
			}
		},onLoad(){
			this.onList();
		},onReachBottom(){
			var page=this.page;
			
			if(page<this.allpage){
				page++;
				this.showError='加载中...';
			}else{
				this.showError='暂无更多数据了~';
				return;
			}
			
			this.onList(page);
		},
		onPullDownRefresh() {
			this.list=[];
			
			this.show=true;
			
			this.onList(1);
		},methods:{
			onList(page=1){
				var that=this;
				
				this.$request({
					url:"/user/my_dynamic",
					data:{page:page},
					success(res){
						if(res.data.code==1){
							that.page=res.data.data.page;
							
							that.allpage=res.data.data.allpage;
							
							var list=res.data.data.list;
							
							for(var i in list){
								that.list.push(list[i]);
							}
							
							that.show=false;
							
							that.showError='';
							//备注.txt
							uni.stopPullDownRefresh();
						}else{
							that.show=false;
							
							that.$refs.uToast.show({
								title: res.data.msg,
								type: 'warning'
							})
						}
					},fail(){
						that.$refs.uToast.show({
							title: '网络繁忙',
							type: 'warning'
						})
					}
				})
			},
			onNav(e){
				var id=e.currentTarget.dataset.id;
				
				uni.navigateTo({
				    url: '/pages/dynamic/dynamicView?id='+id
				});
			},
			onRelease(){
				uni.switchTab({
					url: '/pages/dynamic/dynamic',
					animationType: 'pop-in',
					animationDuration: 200
				})
			}
		}
	}
</script>

<style scoped src="../../static/css/dynamic.css"></style>

<style scoped>
	.border{
		border-top:1px solid #F2F2F2;
	}
	.empty{
		width:100%;
		padding:100rpx 0;
		text-align: center;
		border-top:1px solid #F2F2F2;
	}
	.empty .error{
		font-size:34rpx;
		padding:30rpx 0;
	}
	.empty .btn{
		width:200rpx;
		padding:20rpx 30rpx;
		border-radius:40rpx;
		margin:auto;
		background-color: #EA4389;
		color:#fff;
	}
</style>
